<template>
	<view class="task-wrap">
		<view class="scroll-wrap" style="position: relative;">
			<view class="tabContainer" style="margin-bottom: 120px;">
				<!-- 样品列表 -->
				<view class="sample-term-wrap">
					<view class="sample-term" style="border-radius: 16px;padding: 0;">
						<view class="center_between">
							<view class="content center_between">
								<!-- <view class="content" style="margin-right: 10px;text-align: left;">
									的发表分析
								</view> -->
								<u-search :show-action="true" action-text="搜索" :animation="true"
									placeholder="请输入申请人/申请批次" style='width: 100%;' v-model="keyword" :focus="true"
									@search="query" @custom='query' />
							</view>
						</view>
					</view>
					<view class="u-page__item">
						<view class="u-collapse-content">
						
							<view class="sample-term" v-for="(item,index) in subCheckStandardIds"
								:key="index2"
								style="position: relative; margin-top: 0;box-shadow:0 0 0;margin-bottom: 8px;">
								<view class="center_between">
									<b style="width: 100px;">仪器名称</b>
									<view class="content center_between">
										<b class="content"
											style="margin-right: 10px;text-align: left;color: #193566;">
											{{item.name}}
										</b>
									</view>
								</view>
								<view class="center_between" style="margin: 8px 0;">
									<view style="width: 100px;font-size: 12px;">仪器编号</view>
									<view class="content center_between">
										<view class="content" style="margin-right: 10px;text-align: left;">
											{{item.number}}
										</view>
									</view>
								</view>
								<view class="center_between" style="margin:0 0 8px 0;">
									<view style="width: 100px;font-size: 12px;">放置地点</view>
									<view class="content center_between">
										<view class="content" style="margin-right: 10px;text-align: left;">
											{{item.position}}
										</view>
									</view>
								</view>
								<view class="center_between">
									<view style="width: 100px;font-size: 12px;">仪器出入库状态</view>
									<view class="content center_between">
										<view class="content" style="margin-right: 10px;text-align: left;">
											<text class="value" v-if="item.status == '1'">待领用</text>
											<text class="value" v-if="item.status == '2'">待入库 </text>
											<text class="value" v-if="item.status == '3'">已归还</text>
											<text class="value" v-if="item.status == '4'">逾期</text>
											<text class="value" v-if="item.status == '5'">驳回</text>
										</view>
									</view>
								</view>	
												
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				visiable: false,
				// checked: false,
				checkboxVisible: true,
				keyword: '',
				taskId: '',
				dataList: [],
				factorList: [],
				checkedItem: [],
				sampleTaskInfo: {
					projectName: '',
					consignorName: '',
					inspectionName: '',
					sampleCount: '',
					jobId: '',
					inspectionLinker: '',
					singImageUrl: '',
					sampleVos: [],
				},
				id: "",
				useSubId: "",
				subCheckStandardIds:{}
			}
		},
		onShow() {},
		mounted() {
			this.query()
		},
		methods: {
			//复选框选中事件
			checkboxChange(e, item, val) {
				console.log(val)
			},
			//查询
			searchFactor(item, index) {
				item.subCheckStandardIds = item.deviceVos
				console.log(item.subCheckStandardIds)
				this.$forceUpdate()
				this.$refs.collapse.init()
			},
			// 获取
			query() {
				uni.showLoading({
					title: "加载中..."
				})
					console.log("管理员-待返还仪器")
				let params = {
					fuzzy: this.keyword
				}
				this.$api.returnList(params,res => {
					if (res.code == 200) {
						console.log(res)
						this.subCheckStandardIds = res.result
					}

				})
			},

		}
	}
</script>

<style scoped>
	uni-page-body {
		height: 100%;
	}

	/deep/ .u-action-active {
		margin-left: 0;
		color: #3879d9;
	}

	.task-wrap {
		background: #F0F2FA;
		height: 100vh;
		display: flex;
		flex-direction: column;

	}


	.scroll-wrap {
		flex: 1;
		overflow: scroll;
		padding-bottom: 50rpx;
	}

	.tabContainer {
		height: auto;
	}

	.signature {
		position: absolute;
		top: 0;
		right: 0;
		width: 167rpx;
		height: 61rpx;
		color: #fff;
		background-color: #193566;
		border-radius: 19rpx 19rpx 19rpx 19rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 25rpx;
	}

	.footerBtn {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
	}

	.btn {
		border-radius: 0;
		width: 100%;
		background: #2f3a89;
	}

	.footerBtns {
		display: flex;
		background: #d2dcf8;
		padding: 10rpx 0;
		box-shadow: -1px 0 1px #ccc;
	}

	.dialogBtns {
		position: absolute;
		top: -180rpx;
		left: 0;
		padding: 10rpx 20rpx;
		background: #d2dcf8;
		width: 100%;
		box-shadow: 1px 0px 1px #ccc;
		padding-top: 20rpx;
	}

	.dialogBtn {
		border: 1px solid #eee;
		margin-bottom: 10rpx;
		width: 100%;
		padding: 0;
		font-size: 14px;
		height: 60rpx;
		color: #2f3a89;
		background: #ffda94;
	}

	.leftTabsBtn {
		width: 100%;
		border: 1px solid #fff;
		height: 60rpx;
		font-size: 14px;
		color: #2f3a89;
		background: #d3dcf9;
		box-shadow: 0px 0px 1px 1px #bbb;
	}

	.rightTabsBtn {
		height: 60rpx;
		font-size: 14px;
		background: #2f3a89;
	}

	.rightTabsSingleBtn {
		width: 50%;
		color: #2f3a89;
		height: 60rpx;
		font-size: 14px;
		box-shadow: 1px 1px 3px #ccc;
	}

	.center_between {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.top_head {
		background: #d3dcf9;
		padding: 10px;
	}

	.top_head_nav {
		display: flex;
		justify-content: space-between;
		align-items: center;

	}

	.content {
		flex: 1;
		text-align: right;
		color: #68696d;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	.font_left {
		text-align: left;
	}

	.sample-term-wrap {
		width: calc(100%-70rpx);
		display: flex;
		justify-content: center;
		flex-direction: column;
		/* align-items: center; */
		padding-left: 35rpx;
		padding-right: 35rpx;
	}

	.sample-term {
		/* width: 90%; */
		/* min-height:390rpx; */
		/* height:370rpx; */
		margin: 20rpx 0 30rpx 0;
		border-radius: 16rpx;
		background: #fff;
		padding: 20rpx;
		box-shadow: 0px 3px 3px 1px rgba(0, 0, 0, 0.16);
		margin-top: 20rpx;
	}

	.FactorNav {
		border-radius: 16rpx;
		box-shadow: 0px 3px 3px 1px rgba(0, 0, 0, 0.16);
		margin-top: 20rpx;
		overflow: hidden;
	}

	.nav_btn {
		position: absolute;
		top: 10rpx;
		right: 0rpx;
	}

	.navSingleBtn {
		height: 50rpx;
		color: #fff;
		font-size: 12px;
		padding: 0 8px;
		background: #2f3a89;
		box-shadow: 1px 1px 3px #ccc;
	}

	.openFactorNav {
		color: #fff;
		padding: 8px 0;
		font-size: 12px;
		text-align: center;
		background: #193566;
	}

	/deep/.u-icon-wrap {
		display: none;
	}

	/deep/.u-collapse-head {
		padding-bottom: 0;
	}

	/deep/.u-collapse-body {
		/* height: auto!important; */
	}
</style>